<template>
  <main class="pug-pro-basicLayout-content pug-pro-basicLayout-has-header">
    <div class="pug-pro-page-container">
      <div class="pug-pro-page-container-warp">
        <div class="pug-page-header has-breadcrumb">
          <div class="pug-page-header-heading">
            <div class="pug-page-header-heading-left">
              <span class="pug-page-header-heading-title" title="分步表单">分步表单</span>
            </div>
          </div>
          <div class="pug-page-header-content">
            <div class="pug-pro-page-container-detail">
              <div class="pug-pro-page-container-main">
                <div class="pug-pro-page-container-row">
                  <div class="pug-pro-page-container-content">
                    表单页用于向用户收集或验证信息，分步表单常见于数据项较少的表单场景。
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="pug-pro-grid-content">
        <div class="pug-pro-grid-content-children">
          <div class="pug-pro-layout-watermark-wrapper" style="position: relative;">
            <div class="pug-pro-page-container-children-content">
              <div class="pug-card">
                <div class="pug-pro-steps-form-steps-container" style="max-width: 960px;padding: 50px 0">
                  <div class="pug-steps pug-steps-horizontal pug-steps-label-horizontal">
                    <div class="pug-steps-item" @click="next(1)" :class="[currentStep>=1?'pug-steps-item-process pug-steps-item-active':'']">
                      <div class="pug-steps-item-container">
                        <div class="pug-steps-item-tail"></div>
                        <div class="pug-steps-item-icon"><span class="pug-steps-icon">1</span></div>
                        <div class="pug-steps-item-content">
                          <div class="pug-steps-item-title">基本信息</div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-steps-item pug-steps-item-wait" @click="next(2)" :class="[currentStep>=2?'pug-steps-item-process pug-steps-item-active':'']">
                      <div class="pug-steps-item-container">
                        <div class="pug-steps-item-tail"></div>
                        <div class="pug-steps-item-icon"><span class="pug-steps-icon">2</span></div>
                        <div class="pug-steps-item-content">
                          <div class="pug-steps-item-title">明细信息</div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-steps-item pug-steps-item-wait" @click="next(3)" :class="[currentStep>=3?'pug-steps-item-process pug-steps-item-active':'']">
                      <div class="pug-steps-item-container">
                        <div class="pug-steps-item-tail"></div>
                        <div class="pug-steps-item-icon"><span class="pug-steps-icon">3</span></div>
                        <div class="pug-steps-item-content">
                          <div class="pug-steps-item-title">发布完成</div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="pug-card-body" v-show="currentStep==1">
                  <form id="basic1" autocomplete="off" class="pug-form pug-form-vertical pug-form-hide-required-mark" style="margin: 8px auto auto; max-width: 600px;">
                    <input type="text" style="display: none;" />

                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_title" class="pug-form-item-required" title="标题">标题</label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
														<span class="pug-input-affix-wrapper pro-field pro-field-md"><input placeholder="给目标起个名字"

                                                                                                class="pug-input w328"
                                                                                                type="text"
                            /></span>
                          </div>
                        </div>
                      </div>
                    </div>

                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_title" class="pug-form-item-required" title="标题">标题</label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <div>
                              <div class="pug-form-item-control-input-content">
                                <pug-select showtext="请选择性别" v-model="userselect"></pug-select>
                                {{ userselect }}
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>

                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_date" class="pug-form-item-required" title="起止日期">起止日期</label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <div class="pug-picker pug-picker-range pro-field pro-field-md">
                              <div class="pug-picker-input pug-picker-input-active">
                                <input readonly="" placeholder="开始日期" size="12" @click="startshowevent" autocomplete="off" v-model="starttime" />
                              </div>
                              <div class="pug-picker-range-separator">
																<span aria-label="to" class="pug-picker-separator"><span role="img" aria-label="swap-right"
                                                                                         class="anticon anticon-swap-right">
                    <svg viewbox="0 0 1024 1024" focusable="false" data-icon="swap-right" width="1em" height="1em"
                         fill="currentColor" aria-hidden="true">
                     <path
                       d="M873.1 596.2l-164-208A32 32 0 00684 376h-64.8c-6.7 0-10.4 7.7-6.3 13l144.3 183H152c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h695.9c26.8 0 41.7-30.8 25.2-51.8z"></path>
                    </svg></span></span>
                              </div>
                              <div class="pug-picker-input">
                                <input readonly="" placeholder="结束日期" size="12" @click="endshowevent" autocomplete="off" v-model="endtime" />
                              </div>
                              <div class="pug-picker-active-bar" style="left: 0px; width: 127px; position: absolute;"></div>
                              <span class="pug-picker-suffix"><span role="img" aria-label="calendar"
                                                                    class="anticon anticon-calendar">
                   <svg viewbox="64 64 896 896" focusable="false" data-icon="calendar" width="1em" height="1em"
                        fill="currentColor" aria-hidden="true">
                    <path
                      d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32zm-40 656H184V460h656v380zM184 392V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v136H184z"></path>
                   </svg></span></span>
                            </div>
                            <pug-calendar @callback="timecallback" v-show="startshow" target="starttime" v-model="starttime"></pug-calendar>
                            <pug-calendar @callback="timecallback" v-show="endshow" target="endtime" v-model="endtime"></pug-calendar>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_goal" class="pug-form-item-required" title="目标描述">目标描述</label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <textarea rows="3" placeholder="请输入你的阶段性工作目标" class="pug-input pro-field pro-field-xl"></textarea>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_standard" class="pug-form-item-required" title="衡量标准">衡量标准</label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <textarea rows="3" placeholder="请输入衡量标准" class="pug-input pro-field pro-field-xl"></textarea>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_client" class="" title=""><span>客户<em
                          class="optional___2NpJz">（选填）</em></span><span role="img" aria-label="question-circle"
                                                                         title=""
                                                                         class="anticon anticon-question-circle pug-form-item-tooltip">
                <svg viewbox="64 64 896 896" focusable="false" data-icon="question-circle" width="1em" height="1em"
                     fill="currentColor" aria-hidden="true">
                 <path
                   d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"></path>
                 <path
                   d="M623.6 316.7C593.6 290.4 554 276 512 276s-81.6 14.5-111.6 40.7C369.2 344 352 380.7 352 420v7.6c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V420c0-44.1 43.1-80 96-80s96 35.9 96 80c0 31.1-22 59.6-56.1 72.7-21.2 8.1-39.2 22.3-52.1 40.9-13.1 19-19.9 41.8-19.9 64.9V620c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8v-22.7a48.3 48.3 0 0130.9-44.8c59-22.7 97.1-74.7 97.1-132.5.1-39.3-17.1-76-48.3-103.3zM472 732a40 40 0 1080 0 40 40 0 10-80 0z"></path>
                </svg></span></label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
														<span class="pug-input-affix-wrapper pro-field pro-field-md"><input
                              placeholder="请描述你服务的客户，内部客户直接 @姓名／工号" class="pug-input" type="text"
                            /></span>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_invites" class="" title=""><span>邀评人<em class="optional___2NpJz">（选填）</em></span></label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
														<span class="pug-input-affix-wrapper pro-field pro-field-md"><input
                              placeholder="请直接 @姓名／工号，最多可邀请 5 人" class="pug-input" type="text"
                              v-model="imgurl"/></span>
                          </div>
                          <pug-upload @callback="uploadSuccess" uploadname="pick1" v-model="imgurl"></pug-upload>
                        </div>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
														<span class="pug-input-affix-wrapper pro-field pro-field-md"><input
                              placeholder="请直接 @姓名／工号，最多可邀请 5 人" class="pug-input" type="text"
                              v-model="imgurl2"/></span>
                          </div>
                          <pug-upload @callback="uploadSuccess" uploadname="pick2" v-model="imgurl2"></pug-upload>
                        </div>
                      </div>
                    </div>

                    <div class="pug-row pug-form-item pug-form-item-with-help" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_publicType" class="" title="目标公开">目标公开</label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <pug-radio v-model="male" :items='[{text:"发布",value:1},{text:"未发布",value:0},]' :is-value="false"></pug-radio>
                            {{ male }}
                          </div>
                        </div>
                        <div class="pug-form-item-explain pug-form-item-explain-connected">
                          <div role="alert" class="" style="">
                            客户、邀评人默认被分享
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item pug-form-item-with-help" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_publicType" class="" title="目标公开">兴趣爱好</label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <pug-checkbox v-model="hobbys" :is-value="false"></pug-checkbox>
                            {{ hobbys }}
                          </div>
                        </div>
                        <div class="pug-form-item-explain pug-form-item-explain-connected">
                          <div role="alert" class="" style="">
                            客户、邀评人默认被分享
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <div class="pug-select pug-pro-filed-search-select pro-field pro-field-md pug-select-single pug-select-allow-clear pug-select-show-arrow" style="margin: 8px 0px; display: none;">
                              <div class="pug-select-selector">
																<span class="pug-select-selection-search"><input
                                  autocomplete="off" type="search"
                                  class="pug-select-selection-search-input"
                                  readonly="" unselectable="on"
                                  style="opacity: 0;"/></span>
                                <span class="pug-select-selection-placeholder">请选择</span>
                              </div>
                              <span class="pug-select-arrow" unselectable="on" aria-hidden="true" style="user-select: none;"><span role="img" aria-label="down"
                                                                                                                                   class="anticon anticon-down pug-select-suffix">
                   <svg viewbox="64 64 896 896" focusable="false" data-icon="down" width="1em" height="1em"
                        fill="currentColor" aria-hidden="true">
                    <path
                      d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path>
                   </svg></span></span>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-space pug-space-horizontal pug-space-align-center" style="flex-wrap: wrap; gap: 8px;">
                      <div class="pug-space-item" style="">
                        <button type="button" class="pug-btn" @click="save()"><span>保存</span></button>
                      </div>
                      <div class="pug-space-item" style="">
                        <button type="button" class="pug-btn pug-btn-primary" @click="next(2)"><span>下一步</span></button>
                      </div>
                    </div>
                  </form>
                </div>
                <div class="pug-card-body" v-show="currentStep==2">
                  <form id="basic2" autocomplete="off" class="pug-form pug-form-vertical pug-form-hide-required-mark" style="margin: 8px auto auto; max-width: 600px;">
                    <input type="text" style="display: none;" />
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_title" class="pug-form-item-required" title="标题">标题</label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
														<span class="pug-input-affix-wrapper pro-field pro-field-md"><input placeholder="给目标起个名字"

                                                                                                class="pug-input w328"
                                                                                                type="text"
                            /></span>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_date" class="pug-form-item-required" title="起止日期">起止日期</label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <div class="pug-picker pug-picker-range pro-field pro-field-md">
                              <div class="pug-picker-input pug-picker-input-active">
                                <input readonly="" placeholder="开始日期" size="12" autocomplete="off" />
                              </div>
                              <div class="pug-picker-range-separator">
																<span aria-label="to" class="pug-picker-separator"><span role="img" aria-label="swap-right"
                                                                                         class="anticon anticon-swap-right">
                    <svg viewbox="0 0 1024 1024" focusable="false" data-icon="swap-right" width="1em" height="1em"
                         fill="currentColor" aria-hidden="true">
                     <path
                       d="M873.1 596.2l-164-208A32 32 0 00684 376h-64.8c-6.7 0-10.4 7.7-6.3 13l144.3 183H152c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h695.9c26.8 0 41.7-30.8 25.2-51.8z"></path>
                    </svg></span></span>
                              </div>
                              <div class="pug-picker-input">
                                <input readonly="" placeholder="结束日期" size="12" autocomplete="off" />
                              </div>
                              <div class="pug-picker-active-bar" style="left: 0px; width: 127px; position: absolute;"></div>
                              <span class="pug-picker-suffix"><span role="img" aria-label="calendar"
                                                                    class="anticon anticon-calendar">
                   <svg viewbox="64 64 896 896" focusable="false" data-icon="calendar" width="1em" height="1em"
                        fill="currentColor" aria-hidden="true">
                    <path
                      d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32zm-40 656H184V460h656v380zM184 392V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v136H184z"></path>
                   </svg></span></span>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_goal" class="pug-form-item-required" title="目标描述">目标描述</label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <textarea rows="3" placeholder="请输入你的阶段性工作目标" class="pug-input pro-field pro-field-xl"></textarea>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_standard" class="pug-form-item-required" title="衡量标准">衡量标准</label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <textarea rows="3" placeholder="请输入衡量标准" class="pug-input pro-field pro-field-xl"></textarea>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_client" class="" title=""><span>客户<em
                          class="optional___2NpJz">（选填）</em></span><span role="img" aria-label="question-circle"
                                                                         title=""
                                                                         class="anticon anticon-question-circle pug-form-item-tooltip">
                <svg viewbox="64 64 896 896" focusable="false" data-icon="question-circle" width="1em" height="1em"
                     fill="currentColor" aria-hidden="true">
                 <path
                   d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"></path>
                 <path
                   d="M623.6 316.7C593.6 290.4 554 276 512 276s-81.6 14.5-111.6 40.7C369.2 344 352 380.7 352 420v7.6c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V420c0-44.1 43.1-80 96-80s96 35.9 96 80c0 31.1-22 59.6-56.1 72.7-21.2 8.1-39.2 22.3-52.1 40.9-13.1 19-19.9 41.8-19.9 64.9V620c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8v-22.7a48.3 48.3 0 0130.9-44.8c59-22.7 97.1-74.7 97.1-132.5.1-39.3-17.1-76-48.3-103.3zM472 732a40 40 0 1080 0 40 40 0 10-80 0z"></path>
                </svg></span></label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
														<span class="pug-input-affix-wrapper pro-field pro-field-md"><input
                              placeholder="请描述你服务的客户，内部客户直接 @姓名／工号" class="pug-input" type="text"
                            /></span>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_invites" class="" title=""><span>邀评人<em class="optional___2NpJz">（选填）</em></span></label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
														<span class="pug-input-affix-wrapper pro-field pro-field-md"><input
                              placeholder="请直接 @姓名／工号，最多可邀请 5 人" class="pug-input" type="text"
                            /></span>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_weight" class="" title=""><span>权重<em
                          class="optional___2NpJz">（选填）</em></span></label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <div class="pug-input-number pro-field pro-field-xs pug-input-number-focused">
                              <div class="pug-input-number-handler-wrap">
																<span unselectable="on" role="button" aria-label="Increase Value" aria-disabled="false" class="pug-input-number-handler pug-input-number-handler-up"><span role="img" aria-label="up"
                                                                                                                                                                                           class="anticon anticon-up pug-input-number-handler-up-inner">
                    <svg viewbox="64 64 896 896" focusable="false" data-icon="up" width="1em" height="1em"
                         fill="currentColor" aria-hidden="true">
                     <path
                       d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"></path>
                    </svg></span></span>
                                <span unselectable="on" role="button" aria-label="Decrease Value" aria-disabled="false" class="pug-input-number-handler pug-input-number-handler-down"><span role="img"
                                                                                                                                                                                             aria-label="down"
                                                                                                                                                                                             class="anticon anticon-down pug-input-number-handler-down-inner">
                    <svg viewbox="64 64 896 896" focusable="false" data-icon="down" width="1em" height="1em"
                         fill="currentColor" aria-hidden="true">
                     <path
                       d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path>
                    </svg></span></span>
                              </div>
                              <div class="pug-input-number-input-wrap">
                                <input autocomplete="off" role="spinbutton" aria-valuemin="0" aria-valuemax="100" step="1" placeholder="请输入" class="pug-input-number-input" value="0%" />
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item pug-form-item-with-help" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_publicType" class="" title="目标公开">目标公开</label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <div class="pug-radio-group pug-radio-group-outline pug-pro-field-radio-horizontal">
                              <label class="pug-radio-wrapper"><span class="pug-radio"><input type="radio"
                                                                                              class="pug-radio-input"
                                                                                              value="1"/><span
                                class="pug-radio-inner"></span></span><span>公开</span></label>
                              <label class="pug-radio-wrapper pug-radio-checked"><span class="pug-radio"><input
                                type="radio" class="pug-radio-input" value="2"/><span
                                class="pug-radio-inner"></span></span><span>部分公开</span></label>
                              <label class="pug-radio-wrapper"><span class="pug-radio"><input type="radio"
                                                                                              class="pug-radio-input"
                                                                                              value="3"/><span
                                class="pug-radio-inner"></span></span><span>不公开</span></label>
                            </div>
                          </div>
                        </div>
                        <div class="pug-form-item-explain pug-form-item-explain-connected">
                          <div role="alert" class="" style="">
                            客户、邀评人默认被分享
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <div class="pug-select pug-pro-filed-search-select pro-field pro-field-md pug-select-single pug-select-allow-clear pug-select-show-arrow" style="margin: 8px 0px; display: none;">
                              <div class="pug-select-selector">
																<span class="pug-select-selection-search"><input
                                  autocomplete="off" type="search"
                                  class="pug-select-selection-search-input"


                                  readonly="" unselectable="on"
                                  style="opacity: 0;"/></span>
                                <span class="pug-select-selection-placeholder">请选择</span>
                              </div>
                              <span class="pug-select-arrow" unselectable="on" aria-hidden="true" style="user-select: none;"><span role="img" aria-label="down"
                                                                                                                                   class="anticon anticon-down pug-select-suffix">
                   <svg viewbox="64 64 896 896" focusable="false" data-icon="down" width="1em" height="1em"
                        fill="currentColor" aria-hidden="true">
                    <path
                      d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path>
                   </svg></span></span>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-space pug-space-horizontal pug-space-align-center" style="flex-wrap: wrap; gap: 8px;">
                      <div class="pug-space-item" style="">
                        <button type="button" class="pug-btn" @click="save"><span>保存</span></button>
                      </div>
                      <div class="pug-space-item" style="">
                        <button type="button" class="pug-btn pug-btn-primary" @click="prev(1)"><span>上一步</span></button>
                      </div>
                      <div class="pug-space-item" style="">
                        <button type="button" class="pug-btn pug-btn-primary" @click="next(3)"><span>下一步</span></button>
                      </div>
                    </div>
                  </form>
                </div>
                <div class="pug-card-body" v-show="currentStep==3">
                  <form id="basic3" autocomplete="off" class="pug-form pug-form-vertical pug-form-hide-required-mark" style="margin: 8px auto auto; max-width: 600px;">
                    <input type="text" style="display: none;" />
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_title" class="pug-form-item-required" title="标题">标题</label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
														<span class="pug-input-affix-wrapper pro-field pro-field-md"><input placeholder="给目标起个名字"

                                                                                                class="pug-input w328"
                                                                                                type="text"
                            /></span>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_date" class="pug-form-item-required" title="起止日期">起止日期</label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <div class="pug-picker pug-picker-range pro-field pro-field-md">
                              <div class="pug-picker-input pug-picker-input-active">
                                <input readonly="" placeholder="开始日期" size="12" autocomplete="off" />
                              </div>
                              <div class="pug-picker-range-separator">
																<span aria-label="to" class="pug-picker-separator"><span role="img" aria-label="swap-right"
                                                                                         class="anticon anticon-swap-right">
                    <svg viewbox="0 0 1024 1024" focusable="false" data-icon="swap-right" width="1em" height="1em"
                         fill="currentColor" aria-hidden="true">
                     <path
                       d="M873.1 596.2l-164-208A32 32 0 00684 376h-64.8c-6.7 0-10.4 7.7-6.3 13l144.3 183H152c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h695.9c26.8 0 41.7-30.8 25.2-51.8z"></path>
                    </svg></span></span>
                              </div>
                              <div class="pug-picker-input">
                                <input readonly="" placeholder="结束日期" size="12" autocomplete="off" />
                              </div>
                              <div class="pug-picker-active-bar" style="left: 0px; width: 127px; position: absolute;"></div>
                              <span class="pug-picker-suffix"><span role="img" aria-label="calendar"
                                                                    class="anticon anticon-calendar">
                   <svg viewbox="64 64 896 896" focusable="false" data-icon="calendar" width="1em" height="1em"
                        fill="currentColor" aria-hidden="true">
                    <path
                      d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32zm-40 656H184V460h656v380zM184 392V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v136H184z"></path>
                   </svg></span></span>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_goal" class="pug-form-item-required" title="目标描述">目标描述</label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <textarea rows="3" placeholder="请输入你的阶段性工作目标" class="pug-input pro-field pro-field-xl"></textarea>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_standard" class="pug-form-item-required" title="衡量标准">衡量标准</label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <textarea rows="3" placeholder="请输入衡量标准" class="pug-input pro-field pro-field-xl"></textarea>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_client" class="" title=""><span>客户<em
                          class="optional___2NpJz">（选填）</em></span><span role="img" aria-label="question-circle"
                                                                         title=""
                                                                         class="anticon anticon-question-circle pug-form-item-tooltip">
                <svg viewbox="64 64 896 896" focusable="false" data-icon="question-circle" width="1em" height="1em"
                     fill="currentColor" aria-hidden="true">
                 <path
                   d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"></path>
                 <path
                   d="M623.6 316.7C593.6 290.4 554 276 512 276s-81.6 14.5-111.6 40.7C369.2 344 352 380.7 352 420v7.6c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V420c0-44.1 43.1-80 96-80s96 35.9 96 80c0 31.1-22 59.6-56.1 72.7-21.2 8.1-39.2 22.3-52.1 40.9-13.1 19-19.9 41.8-19.9 64.9V620c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8v-22.7a48.3 48.3 0 0130.9-44.8c59-22.7 97.1-74.7 97.1-132.5.1-39.3-17.1-76-48.3-103.3zM472 732a40 40 0 1080 0 40 40 0 10-80 0z"></path>
                </svg></span></label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
														<span class="pug-input-affix-wrapper pro-field pro-field-md"><input
                              placeholder="请描述你服务的客户，内部客户直接 @姓名／工号" class="pug-input" type="text"
                            /></span>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_invites" class="" title=""><span>邀评人<em class="optional___2NpJz">（选填）</em></span></label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
														<span class="pug-input-affix-wrapper pro-field pro-field-md"><input
                              placeholder="请直接 @姓名／工号，最多可邀请 5 人" class="pug-input" type="text"
                            /></span>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_weight" class="" title=""><span>权重<em
                          class="optional___2NpJz">（选填）</em></span></label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <div class="pug-input-number pro-field pro-field-xs pug-input-number-focused">
                              <div class="pug-input-number-handler-wrap">
																<span unselectable="on" role="button" aria-label="Increase Value" aria-disabled="false" class="pug-input-number-handler pug-input-number-handler-up"><span role="img" aria-label="up"
                                                                                                                                                                                           class="anticon anticon-up pug-input-number-handler-up-inner">
                    <svg viewbox="64 64 896 896" focusable="false" data-icon="up" width="1em" height="1em"
                         fill="currentColor" aria-hidden="true">
                     <path
                       d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"></path>
                    </svg></span></span>
                                <span unselectable="on" role="button" aria-label="Decrease Value" aria-disabled="false" class="pug-input-number-handler pug-input-number-handler-down"><span role="img"
                                                                                                                                                                                             aria-label="down"
                                                                                                                                                                                             class="anticon anticon-down pug-input-number-handler-down-inner">
                    <svg viewbox="64 64 896 896" focusable="false" data-icon="down" width="1em" height="1em"
                         fill="currentColor" aria-hidden="true">
                     <path
                       d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path>
                    </svg></span></span>
                              </div>
                              <div class="pug-input-number-input-wrap">
                                <input autocomplete="off" role="spinbutton" aria-valuemin="0" aria-valuemax="100" step="1" placeholder="请输入" class="pug-input-number-input" value="0%" />
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item pug-form-item-with-help" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-label">
                        <label htmlfor="basic_publicType" class="" title="目标公开">目标公开</label>
                      </div>
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <div class="pug-radio-group pug-radio-group-outline pug-pro-field-radio-horizontal">
                              <label class="pug-radio-wrapper"><span class="pug-radio"><input type="radio"
                                                                                              class="pug-radio-input"
                                                                                              value="1"/><span
                                class="pug-radio-inner"></span></span><span>公开</span></label>
                              <label class="pug-radio-wrapper pug-radio-checked"><span class="pug-radio"><input
                                type="radio" class="pug-radio-input" value="2"/><span
                                class="pug-radio-inner"></span></span><span>部分公开</span></label>
                              <label class="pug-radio-wrapper"><span class="pug-radio"><input type="radio"
                                                                                              class="pug-radio-input"
                                                                                              value="3"/><span
                                class="pug-radio-inner"></span></span><span>不公开</span></label>
                            </div>
                          </div>
                        </div>
                        <div class="pug-form-item-explain pug-form-item-explain-connected">
                          <div role="alert" class="" style="">
                            客户、邀评人默认被分享
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-row pug-form-item" style="row-gap: 0px;">
                      <div class="pug-col pug-form-item-control">
                        <div class="pug-form-item-control-input">
                          <div class="pug-form-item-control-input-content">
                            <div class="pug-select pug-pro-filed-search-select pro-field pro-field-md pug-select-single pug-select-allow-clear pug-select-show-arrow" style="margin: 8px 0px; display: none;">
                              <div class="pug-select-selector">
																<span class="pug-select-selection-search"><input
                                  autocomplete="off" type="search"
                                  class="pug-select-selection-search-input"


                                  readonly="" unselectable="on"
                                  style="opacity: 0;"/></span>
                                <span class="pug-select-selection-placeholder">请选择</span>
                              </div>
                              <span class="pug-select-arrow" unselectable="on" aria-hidden="true" style="user-select: none;"><span role="img" aria-label="down"
                                                                                                                                   class="anticon anticon-down pug-select-suffix">
                   <svg viewbox="64 64 896 896" focusable="false" data-icon="down" width="1em" height="1em"
                        fill="currentColor" aria-hidden="true">
                    <path
                      d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path>
                   </svg></span></span>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="pug-space pug-space-horizontal pug-space-align-center" style="flex-wrap: wrap; gap: 8px;">
                      <div class="pug-space-item" style="">
                        <button type="button" class="pug-btn" @click="save"><span>保存</span></button>
                      </div>
                      <div class="pug-space-item" style="">
                        <button type="button" class="pug-btn pug-btn-primary" @click="prev(2)"><span>上一步</span></button>
                      </div>
                    </div>
                  </form>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </main>
</template>
<script>
export default {
  name: "sortform",
  components: {},
  data() {
    return {
      currentStep: 1,
      userselect: "",
      male: "",
      starttime: "",
      endtime: "",
      startshow: false,
      endshow: false,
      imgurl: "",
      imgurl2: "",
      hobbys: [],
      steps: [1, 2, 3]
    }
  },

  created() {

  },
  methods: {
    save() {

    },

    timecallback() {
      this.startshow = false;
      this.endshow = false;
    },

    startshowevent() {
      this.startshow = true;
    },

    endshowevent() {
      this.endshow = true;
    },

    prev(index) {
      this.currentStep = index;
    },

    next(index) {
      this.currentStep = index;
    },

    uploadSuccess(response) {
      console.log("uploadSuccess:", response)
    }
  }
}
</script>
<style scoped="">

</style>
